<?php
use \yii\helpers\HtmlPurifier;
$this->title='reading';
$this->registerJSFile('@web/js/reading.js',['depends'=>['app\assets\AppAsset']]);
$this->registerJsFile('@web/js/highlightq.js',['depends'=>['app\assets\AppAsset']]);
$this->registerJSFile('@web/js/note.js',['depends'=>['app\assets\AppAsset']]);
$options=[];
foreach ($read_option as $a)
{
    switch($a['options'])
    {
        case 'A':
            $options['A']=$a['content'];
            break;
        case 'B':
            $options['B']=$a['content'];
            break;
        case 'C':
            $options['C']=$a['content'];
            break;
        case 'D':
            $options['D']=$a['content'];
            break;
        case 'E':
            $options['E']=$a['content'];
            break;
        case 'F':
            $options['F']=$a['content'];
            break;
        case 'G':
            $options['G']=$a['content'];
            break;
    }
}
?>
<form action="?r=reading/index" id="nextque" method="post">
    <input type="hidden" name="que" value="<?=$que;?>">
    <input name="_csrf" type="hidden" id="_csrf" value="<?= Yii::$app->request->csrfToken ?>">
    <input name="usercheck" type="hidden" value="">
    <input type="hidden" name="post_type" value="">
</form>
<script>
    window.onload = function () {
        gotoPragraph(<?=$read_question['paragraph']?>);
        var $submit_time=$("[name=post_type]").clone(true).attr("name","time");
        var t=0;
        $submit_time.appendTo("#nextque");
        $.ajax({
            url: "?r=ajax/gettime&state=<?=$state;?>&token=<?=$token;?>",
            dataType: 'json',
            type: 'get',
            success: function (data) {
                var sec=data.time;			//初始时间，以秒为单位
                var $time=$("i.fa-clock-o");
                setInterval(
                    function(){
                        sec++;
                        t++;
                        $time.html(secToMin(sec));
                        $submit_time.val(t);
                    },1000);
            }
        });
    };
</script>
<div class="container">
	<div class="leadx row clearfix">
		<div class="col-xs-3 pull-left">
			<span><?=strtoupper($class2_name);?>-<?=$read_content['class_num'];?> Reading Passage <?=$read_content['passage'];?> of 3</span>
		</div>
		<div class="col-xs-1 pull-left notebook">
			<a href="#"><span><i class="fa fa-pencil-square-o"></i> 笔记</span></a>
		</div>
		<div class="col-xs-1 pull-right">
			<span><i class="fa fa-clock-o"></i></span>
		</div>
	</div>
	<div class="read-wrap">
		<div class="read-info row">Question <?=$read_question['tnum'];?> of <?=$read_question_num;?></div>
		<div class="col-xs-5 read-spe">
			<div class="read-que">
				<p class="que">
                    <?php
                    echo $read_question['tnum'];
                    echo ".";
                    echo $read_question['content'];
                    ?>
                </p>
				<p class="que que-bold">Table A:primary groups</p>
				<div class="ansA ansA1"></div>
				<div class="ansA ansA2"></div>
				<div class="ansA ansA3"></div>
				<p class="que que-bold">Table B:primary groups</p>
				<div class="ansB ansB1"></div>
				<div class="ansB ansB2"></div>

                <div class="ans">
                    <form class="form">
                        <div class="ans-opt clearfix">
                            <div class="checkbox pull-left">
                                <label for="ans1-a">
                                    <span class="ans-op ans-opx false <?php if(isset($answer[$que-1])){if($answer[$que-1][0]==1)echo 'ischecked';}?>">A</span>
                                    <input type="radio" id="ans1-a" name="ans1" class="hidden" value="ans1-1">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans1-b">
                                    <span class="ans-op ans-opx true <?php if(isset($answer[$que-1])){if($answer[$que-1][0]==2)echo 'ischecked';}?>">B</span>
                                    <input type="radio" id="ans1-b" name="ans1" class="hidden" value="ans1-2">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans1-none">
                                    <span class="ans-op ans-opx nottrue <?php if(isset($answer[$que-1])){if($answer[$que-1][0]==3)echo 'ischecked';}?>">/</span>
                                    <input type="radio" id="ans1-none" name="ans1" class="hidden" value="ans1-3">
                                </label>
                            </div>
                            <span class="ans-select pull-left">A.</span>
                            <span class="que-text pull-left"><?=$options['A'];?></span>
                        </div>
                        <div class="ans-opt clearfix">
                            <div class="checkbox pull-left">
                                <label for="ans2-a">
                                    <span class="ans-op ans-opx false <?php if(isset($answer[$que-1])){if($answer[$que-1][1]==1)echo 'ischecked';}?>">A</span>
                                    <input type="radio" id="ans2-a" name="ans2" class="hidden" value="ans2-1">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans2-b">
                                    <span class="ans-op ans-opx true <?php if(isset($answer[$que-1])){if($answer[$que-1][1]==2)echo 'ischecked';}?>">B</span>
                                    <input type="radio" id="ans2-b" name="ans2" class="hidden" value="ans2-2">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans2-none">
                                    <span class="ans-op ans-opx nottrue <?php if(isset($answer[$que-1])){if($answer[$que-1][1]==3)echo 'ischecked';}?>">/</span>
                                    <input type="radio" id="ans2-none" name="ans2" class="hidden" value="ans2-3">
                                </label>
                            </div>
                            <span class="ans-select">B.</span>
                            <span class="que-text"><?=$options['B'];?></span>
                        </div>
                        <div class="ans-opt clearfix">
                            <div class="checkbox pull-left">
                                <label for="ans3-a">
                                    <span class="ans-op ans-opx false <?php if(isset($answer[$que-1])){if($answer[$que-1][2]==1)echo 'ischecked';}?>">A</span>
                                    <input type="radio" id="ans3-a" name="ans3" class="hidden" value="ans3-1">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans3-b">
                                    <span class="ans-op ans-opx true <?php if(isset($answer[$que-1])){if($answer[$que-1][2]==2)echo 'ischecked';}?>">B</span>
                                    <input type="radio" id="ans3-b" name="ans3" class="hidden" value="ans3-2">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans3-none">
                                    <span class="ans-op ans-opx nottrue <?php if(isset($answer[$que-1])){if($answer[$que-1][2]==3)echo 'ischecked';}?>">/</span>
                                    <input type="radio" id="ans3-none" name="ans3" class="hidden" value="ans3-3">
                                </label>
                            </div>
                            <span class="ans-select">C.</span>
                            <span class="que-text"><?=$options['C'];?></span>
                        </div>
                        <div class="ans-opt clearfix">
                            <div class="checkbox pull-left">
                                <label for="ans4-a">
                                    <span class="ans-op ans-opx false <?php if(isset($answer[$que-1])){if($answer[$que-1][3]==1)echo 'ischecked';}?>">A</span>
                                    <input type="radio" id="ans4-a" name="ans4" class="hidden" value="ans4-1">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans4-b">
                                    <span class="ans-op ans-opx true <?php if(isset($answer[$que-1])){if($answer[$que-1][3]==2)echo 'ischecked';}?>">B</span>
                                    <input type="radio" id="ans4-b" name="ans4" class="hidden" value="ans4-2">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans4-none">
                                    <span class="ans-op ans-opx nottrue <?php if(isset($answer[$que-1])){if($answer[$que-1][3]==3)echo 'ischecked';}?>">/</span>
                                    <input type="radio" id="ans4-none" name="ans4" class="hidden" value="ans4-3">
                                </label>
                            </div>
                            <span class="ans-select">D.</span>
                            <span class="que-text"><?=$options['D'];?></span>
                        </div>
                        <div class="ans-opt clearfix">
                            <div class="checkbox pull-left">
                                <label for="ans5-a">
                                    <span class="ans-op ans-opx false <?php if(isset($answer[$que-1])){if($answer[$que-1][4]==1)echo 'ischecked';}?>">A</span>
                                    <input type="radio" id="ans5-a" name="ans5" class="hidden" value="ans5-1">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans5-b">
                                    <span class="ans-op ans-opx true <?php if(isset($answer[$que-1])){if($answer[$que-1][4]==2)echo 'ischecked';}?>">B</span>
                                    <input type="radio" id="ans5-b" name="ans5" class="hidden" value="ans5-2">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans5-none">
                                    <span class="ans-op ans-opx nottrue <?php if(isset($answer[$que-1])){if($answer[$que-1][4]==3)echo 'ischecked';}?>">/</span>
                                    <input type="radio" id="ans5-none" name="ans5" class="hidden" value="ans5-3">
                                </label>
                            </div>
                            <span class="ans-select">E.</span>
                            <span class="que-text"><?=$options['E'];?></span>
                        </div>
                        <div class="ans-opt clearfix">
                            <div class="checkbox pull-left">
                                <label for="ans6-a">
                                    <span class="ans-op ans-opx false <?php if(isset($answer[$que-1])){if($answer[$que-1][5]==1)echo 'ischecked';}?>">A</span>
                                    <input type="radio" id="ans6-a" name="ans6" class="hidden" value="ans6-1">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans6-b">
                                    <span class="ans-op ans-opx true <?php if(isset($answer[$que-1])){if($answer[$que-1][5]==2)echo 'ischecked';}?>">B</span>
                                    <input type="radio" id="ans6-b" name="ans6" class="hidden" value="ans6-2">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans6-none">
                                    <span class="ans-op ans-opx nottrue <?php if(isset($answer[$que-1])){if($answer[$que-1][5]==3)echo 'ischecked';}?>">/</span>
                                    <input type="radio" id="ans6-none" name="ans6" class="hidden" value="ans6-3">
                                </label>
                            </div>
                            <span class="ans-select">F.</span>
                            <span class="que-text"><?=$options['F'];?></span>
                        </div>
                        <div class="ans-opt clearfix">
                            <div class="checkbox pull-left">
                                <label for="ans7-a">
                                    <span class="ans-op ans-opx false <?php if(isset($answer[$que-1])){if($answer[$que-1][6]==1)echo 'ischecked';}?>">A</span>
                                    <input type="radio" id="ans7-a" name="ans7" class="hidden" value="ans7-1">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans7-b">
                                    <span class="ans-op ans-opx true <?php if(isset($answer[$que-1])){if($answer[$que-1][6]==2)echo 'ischecked';}?>">B</span>
                                    <input type="radio" id="ans7-b" name="ans7" class="hidden" value="ans7-2">
                                </label>
                            </div>
                            <div class="checkbox pull-left">
                                <label for="ans7-none">
                                    <span class="ans-op ans-opx nottrue <?php if(isset($answer[$que-1])){if($answer[$que-1][6]==3)echo 'ischecked';}?>">/</span>
                                    <input type="radio" id="ans7-none" name="ans7" class="hidden" value="ans7-3">
                                </label>
                            </div>
                            <span class="ans-select">G.</span>
                            <span class="que-text"><?=$options['G'];?></span>
                        </div>
                    </div>
                </form>    
			</div>
		</div>
		<div class="col-xs-7 read-text">
            <p align="center"><b><?=$read_content['title'];?></b></p>
            <?php
            echo $read_content['content'];
            ?>
        </div>
	</div>
</div>
<div class="add-note hidden">
    <div class="row">
        <div class="col-xs-7 text-note">xxxxxxxx</div>
        <div class="col-xs-5 add-note-text">+加到笔记</div>
    </div>
    <div class="row">
        <div class="col-xs-12 add-left">+添加到左侧答案栏</div>
    </div>
</div>
<div class="addnote">
    <div class="note-lead">
        <span id="note-word">笔记</span>
        <span class="close"><i class="fa fa-times"></i></span>
    </div>
    <div class="note-text">
        <div contenteditable="true" id="note-self"><?=HtmlPurifier::process($my_note['note']);?></div>
    </div>
    <form action="#" id="note-form">
        <button type="button" name="note-save" id="note-submit">Save and Close</button>
        <input type="hidden" name="saved-note" value="">
    </form>
</div>